<script setup>
	import { onShow } from '@dcloudio/uni-app'
	import { departmentListApi } from '../../services/consult'
	import { computed, ref } from 'vue'

	onShow(() => {
		getDepartList()
	})
	const props = defineProps({
		type: String,
		illnessType: String,
	})
	const docList = ref([])
	let currentIndex = ref(0)
	const departmentList = computed(() => {
		return docList.value[currentIndex.value]?.child
	})

	const getDepartList = async () => {
		const { data } = await departmentListApi()
		docList.value = data
	}
</script>

<template>
	<view class="department-page">
		<scroll-view scroll-y class="department-primary">
			<view
				class="department-item"
				v-for="(item, index) in docList"
				:class="{ active: currentIndex == index }"
				:key="item.id"
				@click="currentIndex = index"
				>{{ item.name }}</view
			>
		</scroll-view>
		<scroll-view class="department-secondary">
			<navigator
				hover-class="none"
				class="department-item"
				v-for="item in departmentList"
				:key="item.id"
				:url="`/subpkg_consult/description/description?type=${props.type}&illnessType=${props.illnessType}&depId=${item.id}`"
			>
				{{ item.name }}
			</navigator>
		</scroll-view>
	</view>
</template>

<style lang="scss">
	@import './index.scss';
</style>
